<template>
  <div class="page">
    <div class="c_info">
      <img class="c_pic" :src="proDetail.logoImage" mode="widthFix">
      <div>{{proDetail.merchantName}}</div>
      <div class="weui-cell store_address">
        <div class="weui-cell__hd"><img src="../../../static/images/ic_dz.png" mode="widthFix"></div>
        <div class="weui-cell__bd">{{proDetail.merchantAddr}}
        </div>
        <div class="weui-cell__ft phonelink"><img src="../../../static/images/tel.png" mode="widthFix" @click.stop="callPhone(13116858811)"></div>
      </div>
    </div>
    <div class="weui-cells">
      <div class="weui-cell">
        <div class="weui-cell__bd">今日预约</div>
        <div class="weui-cell__ft fs08">今日已有{{proDetail.nowDayNums}}人预约</div>
      </div>
      <div class="weui-cell weui-cell_access fs09">
        <div class="weui-cell__bd lightred" @click="choseProject">选择项目</div>
        {{projuctData.spName||projuctData.productName}}
        <div class="weui-cell__ft fs08"></div>


      </div>
      <div class="weui-cell weui-cell_access fs09" @click="getDateBox">
        <div class="weui-cell__bd lightred" >选择预约时间</div>
        {{time}}
        <div class="weui-cell__ft fs08" ></div>
       <!-- <mp-datepicker ref="mpDatePicker" :defaultDate="defaultDate"  @onConfirm="dateCom"></mp-datepicker>
 -->
      </div>
      <div class="weui-cell weui-cell_access fs09" @click="showBz=true">
        <div class="weui-cell__bd">备注</div>
        {{textBz}}
        <div class="weui-cell__ft fs08"></div>
      </div>
      <div class="weui-cell weui-cell_access fs09" @click="getAppointment">
        <div class="weui-cell__bd">选择技师</div>
        {{appionData.name}}
        <div class="weui-cell__ft fs08"></div>


      </div>
    </div>
<!--    <div class="weui-cells">-->
<!--      <div class="weui-cell">-->
<!--        <div class="weui-cell__bd">个人简介</div>-->
<!--      </div>-->
<!--      <div class="weui-cell weui-cell_access fs09">-->
<!--        <div class="weui-cell__bd fs09">-->
<!--          内容内容-->
<!--        </div>-->
<!--      </div>-->
<!--    </div>-->
    <div class="footbtn">
      <a @click="commitFun">立刻预约</a>
    </div>
<!--    备注-->
    <div v-if="showBz">
      <div class="weui-mask" @click="showBz=false"></div>
      <div class="weui-dialog dialog_bot">
        <div class="weui-dialog__hd dialog_bot_title">
          <span>备注</span>
          <div class="close" @click="showBz=false">×</div>
        </div>
        <div class="weui-dialog__bd weui-flex dialog_bot_con">

          <textarea class="weui-textarea" placeholder="请输入文字" v-model="textBz" rows="3" cols="5" style="background: #F6F6F6"></textarea>
        </div>
        <div class="weui-dialog__ft dialog_bot_btn">
          <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary" @click="bzCom">确认</a>
        </div>
      </div>
    </div>
<!--    <getTime ref="getTIme" @getDate="getDateFun"></getTime>-->
<!--   <appointmentArtificer ref="appointmentArtificer" @getAppion="getAppionFun" :show="show"></appointmentArtificer>-->
<!--   <choseProjuct ref="choseProjuct" @getResult="getResultFun"></choseProjuct>-->
<!--    选择项目-->
    <div v-if="showPro">
      <div class="weui-mask" @click="showPro=false"></div>
      <div class="weui-dialog dialog_bot">
        <div class="weui-dialog__hd dialog_bot_title">
          <span>选择项目</span>
          <div class="close" @click="showPro=false">×</div>
        </div>

        <div class="weui-dialog__bd weui-flex dialog_bot_con" style="flex-wrap: wrap;">
          <template v-if="listPro.length">
            <div class="weui-cell"  style="padding:0;width: 100%;" v-for="(item,index) in listPro" :key="index">
              <div class="weui-cell__hd">
                <van-icon :name="item.isClick"  @click="chengItemIconPro(item,index)" size='1.3em' :color="item.isClick=='circle'?'':'#FF787E'"/>
              </div>
              <div class="weui-cell__hd">
                <img class="s_pic s_pic_r" :src="item.showPic" mode="widthFix">

              </div>
              <div class="weui-cell__bd" style="text-align: left;">
                <div class="s_name" style="color: #333333;">{{item.spName}}</div>
                <div class="s_info" style="color: #333333;">
<!--                  {{item.picPage}}-->
                </div>

              </div>
            </div>
          </template>
        </div>

        <div class="weui-dialog__bd weui-flex dialog_bot_con" v-if="!listPro.length" style="padding:0.8em 0 .8em;display: flex;justify-content: center;">
          暂无项目
        </div>
        <div class="weui-dialog__ft dialog_bot_btn">
          <a  class="weui-dialog__btn weui-dialog__btn_primary" @click="bzComPro">确认</a>
        </div>
      </div>
    </div>
<!--    技师-->
    <div>

      <div v-if="show.showJs">

        <div class="weui-mask" @click="show.showJs=false"></div>
        <div class="weui-dialog dialog_bot">
          <div class="weui-dialog__hd dialog_bot_title">
            <span>选择技师</span>
            <div class="close" @click="show.showJs=false">×</div>
          </div>

          <div class="weui-dialog__bd weui-flex dialog_bot_con" style="flex-wrap: wrap;" >
            <template v-if="listJs.length">
              <div class="weui-cell"  style="padding:0" v-for="(item,index) in listJs" :key="index">
                <div class="weui-cell__hd">
                  <!--  <i-radio   @change="getRasdio(item,$event)" :checked="item.isClick">
                     </i-radio> -->
                  <van-icon :name="item.isClick"  @click="chengItemIcon(item,index)" size='1.3em' :color="item.isClick=='circle'?'':'#FF787E'"/>
                </div>
                <div class="weui-cell__hd">
                  <img class="s_pic s_pic_r" :src="item.head_img_url" mode="widthFix">

                </div>
                <div class="weui-cell__bd" style="text-align: left;">
                  <div class="s_name" style="color: #333333;">{{item.name}}</div>
                  <div class="s_info" style="color: #333333;">
                    {{item.visibleStore}}
                  </div>
                  <div class="s_info" style="display: flex;justify-content: space-around;align-items: center">
                    <span>礼仪:</span>
                    <van-rate readonly :value="item.ceremony_star" :size="5"  />
<!--                    <rate :number="item.ceremony_star?item.ceremony_star*0.1:0" :readonly="true"></rate>-->
                  </div>
                  <div class="s_info" style="display: flex;justify-content: space-around;align-items: center">
                    <span>技能:</span>
                    <van-rate readonly :value="item.skill_star" :size="5"  />
<!--                    <rate :number="item.skill_star?item.skill_star*0.1:0" :readonly="true"></rate>-->
                  </div>
                </div>
              </div>
            </template>
          </div>

          <div class="weui-dialog__bd weui-flex dialog_bot_con" v-if="!listJs.length" style="padding:0.8em 0 .8em;display:flex;justify-content:center;">
            暂无技师
          </div>
          <div class="weui-dialog__ft dialog_bot_btn">
            <a  class="weui-dialog__btn weui-dialog__btn_primary" @click="bzComJs">确认</a>
          </div>
        </div>
      </div>
    </div>
<!--    选择时间-->
    <div v-if="timeShow" class="getTIme">
      <div class="weui-mask" @click="close"></div>
      <div class="weui-dialog dialog_bot">
        <div class="weui-dialog__hd dialog_bot_title" >
          <span>选择预约时间</span>
          <div class="close" @click="close">×</div>
        </div>
        <div class="weui-dialog__bd weui-flex dialog_bot_con">
          <div class="date">
            <ul>
              <template v-if="dateList.length">
                <li v-for="(item,index) in dateList" :key="index" :class="{current:item.isCurrent}" @click="changeDate(item)">{{item.date}}</li>
              </template>


            </ul>
          </div>
          <div class="time weui-flex__item" style="height: 210px;overflow: auto">
            <template v-if="dateMinList.length">
              <div class="weui-flex" v-for="(item,i) in dateMinList" :key="i" :class="{ current:item.isClick}">
                <!-- <div class="weui-flex__item">{{item.label}}</div> -->
                <!--      <div> -->
                <!--                    <input type="radio" v-model="item.isClick" color="#FF787E"  @click="onChange(item)">-->
                <!--  <van-radio-group :value="isClick" @change="handleFruitChange">
                    <van-radio :name="item.label">{{item.label}}</van-radio>
                  </van-radio-group> -->
                <i-radio-group :current="isClick" class="radio-group" v-if="item.isYuYue"  @change="handleFruitChange">
                  <i-radio :value="item.label" position="right" >
                  </i-radio>
                </i-radio-group>
                <p
                  style="height: 48px; color: #FF787E;line-height: 48px;box-sizing: border-box;padding:12px 15px;display: flex;justify-content: space-between;width: 100%;align-items: center;"
                  v-if="!item.isYuYue"
                >
                  <span>{{item.label}}</span>
                  <span>不可预约</span>
                </p>


                <!-- </div> -->
              </div>
            </template>
            <template v-if="!dateMinList.length">
              已下班
            </template>
          </div>
        </div>
        <div class="weui-dialog__ft dialog_bot_btn">
          <a @click="commit" class="weui-dialog__btn weui-dialog__btn_primary">确认</a>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import card from '@/components/card'
import * as appId from "@/utils/util"

import rate from '../../components/rate'
import {mapGetters,mapActions} from "vuex"



// import getTime from "../../components/getTime"
// import appointmentArtificer from "../../components/appointmentArtificer"
// import choseProjuct from "../../components/choseProjuct"
export default {
  data () {
    return {
      // 选择时间
      timeShow:false,
      isClick:"09:00",//时分
      date:"",//月日

      dateList:[],
      id:"",
      dateToday:"",
      week:['周日','周一','周二','周三','周四','周五','周六'],
      startTime:"",
      endTime:"",
      times:"",
      EndMinute:0,
      noYuYue:[],
      dateMinList:[{
        isClick:false
      }],
      // 项目
      showPro:false,
      dataPro:{},
      userInfo:{},
      listPro:[],
      resultListPro:{},
      // 技师
      show:{
        showJs:false
      },
      //
      // userId:"",
      dataJs:{},
      userInfoJs:{},
      listJs:[],
      resultList:{},

      mode: 'multiLinkageSelector',
      showBz:false,
      deepLength:1,
      appionData:{},
      checkboxAnimalsList: [ { value: 'dog' }],
      valueAnimals: ['dog'],

      textBz:"",
      pickerValueArray: [
      ],
      time: '',
      current: 0,
      phone:"",
      userId:"",
      data:{},
      mid:"",
      proDetail:{},
      projuctData:{},//选择的项目
    }
  },
  components: {
    card,



    // appointmentArtificer,
    // choseProjuct
  },
  onLoad(id){
    this.mid=id.mid;
  },

  onShow(){
    this.showBz=false;
    this.show.showJs=false;
    this.showPro=false;
    this. timeShow=false;
    this.dateList=[]
    this.dateMinList=[{
      isClick:false
    }]
     this.time="";
     this.projuctData={};
    wx.setNavigationBarTitle({
      title: "预约详情"
    })
    this.data=JSON.parse(wx.getStorageSync('appointData'));
    if(this.data){
       this.projuctData=this.data
    }
    this.userInfo =wx.getStorageSync('userInfo')&&JSON.parse(wx.getStorageSync('userInfo'))
    if(this.userInfo) {
      this.phone=this.userInfo.mobileNo;
      this.userId=this.userInfo.baseUserId;
      //this. getList(0)
      // this.projectList();
      this.getDetail()
      }else{
      wx.showToast({
        title:'请先登录',
        icon: 'none',
        duration: 2000
      })
    }
  },
  methods: {
    // 选择时间
    getTimeYu(id,date){
      return new Promise((relative)=>{
        this.$http.request({
          method: "post",
          url: "/v1.0/appletAppoint/appletAppointTime",
          body: {
            suffid:id,
            scheduledTime:date,
          }
        }).then((data)=>{
          if(data.code==0){
            relative(data.result||[]);
          }
        })
      })

    },
    close(){
      this.timeShow=false;
      this.dateList=[]
      this.dateMinList=[{
        isClick:false
      }]
    },
    changeMouse(data){
      let mouse=data/60;
    },
    initTime(time,endMinute,id){
      this.id=id;
      this.timeShow=true;

      if(endMinute){
        this.EndMinute=(endMinute/60).toFixed(1);
      }else{
        this.EndMinute=(30/60).toFixed(1);
      }
      if(time){
        this.startTime=Number(time.split('至')[0].split(':')[0]);
        this.endTIme=Number(time.split('至')[1].split(':')[0])-this.EndMinute;
      }else{
        this.startTime=10;
        this.endTIme=22;
      }


      console.log(this.startTime,this.endTIme)
      this.dateList=[]
      this.dateMinList=[{
        isClick:false
      }]
      // tMonth,
      // tDate
      this.times=this.getTodyTime().tYear+'-'+this.getTodyTime().tMonth+'-'+this.getTodyTime().tDate

      console.log(this.timeShow)
      this.getTime()
      this.todayDate(this.startTime, this.endTIme,id,this.times)
    },

    commit(){//确定时间
      if(this.isClick){
        let year= new Date().getFullYear();
        console.log(year,this.date,this.isClick)
        let date=year+'-'+this.date+' '+this.isClick
        this.timeShow=false;
        this.time=date+':00';
       // this.$emit('getDate',date)
      }

    },
    handleFruitChange(val){
      this.isClick=val.target.value;
      // let arr=this.dateMinList.filter((item)=>{
      //   return item.label==this.isClick;
      // })

      this.dateMinList.forEach((a,i)=>{
        a.isClick=false;
        if(a.label==this.isClick){
          a.isClick=true;
        }
      })

      console.log(val)
    },
    // onChange(val){
    //     val.isClick=!val.isClick;
    //   console.log(val)
    // },
    changeDate(item){
      console.log(item)

      this.isClick="9:00";
      this.dateToday=item.date;
      // this.getTimeYu()
      let year="";
      if(this.getTodyTime().tMonth==12&&item.value.split('-')[0]=='01'){
        year=this.getTodyTime().tYear+1;
      }else{
        year=this.getTodyTime().tYear;
      }
      this.todayDate(this.startTime, this.endTIme,this.id,year+'-'+item.value)
      this.dateList.forEach((a,i)=>{
        a.isClick=false;
        a.isCurrent=false
      })
      if(!item.isCurrent){
        item.isCurrent=true;
      }
      this.date=item.value;

    },
    todayDate(a,b,id,times){
      let arr=[];
      // console.log(this.dateToday)
      this.getTimeYu(id,times).then((data)=>{
        if(this.dateToday.indexOf('今')!=-1){
          let house=new Date().getHours();
          let min=new Date().getMinutes();
          // console.log(this.endTime)
          if(house>=b){//超过23点
            this.dateMinList=[];
          }else if(house>=a){//大于9点
            if(min>=30){
              for(var i=house+1;i<b;i+=0.5){
                let obj={};
                obj.label=parseInt(i)+':'+this.isFloat((i-parseInt(i))*60)
                obj.isClick=""
                arr.push(obj)
                // obj.label=
              }
              this.dateMinList=arr;
            }else{
              for(var i=house+0.5;i<b;i+=0.5){
                let obj={};
                obj.label=this.add0(parseInt(i))+':'+this.isFloat((i-parseInt(i))*60)
                obj.isClick=""
                arr.push(obj)
                // obj.label=
              }
              this.dateMinList=arr;
            }

          }else{//小于9点
            if(min>=30){
              for(var i=a;i<b;i+=0.5){
                let obj={};
                obj.label=parseInt(i)+':'+this.isFloat((i-parseInt(i))*60)
                obj.isClick=""
                arr.push(obj)
                // obj.label=
              }
              this.dateMinList=arr;
            }
          }

        }else{
          for(var i=a;i<b;i+=0.5){
            let obj={};
            obj.label=this.add0(parseInt(i))+':'+this.isFloat((i-parseInt(i))*60)
            obj.isClick=""
            arr.push(obj)
            // obj.label=
          }
          this.dateMinList=arr;
        }

       // console.log(this.dateMinList)


        let arrs=data.map((item)=>{
          return this.changeHaomiaoDate(item.reserveTime)
        })
        //console.log(arrs)
        this.dateMinList.forEach((a,i)=>{
          a.isYuYue=true;
          arr.forEach((m,b)=>{
            if(a.label==m){
              a.isYuYue=false;
            }
          })

        })
        // for(let i=0;i<this.dateMinList.length;i++){

        //   // arr.forEach((a,b)=>{
        //   //   if(this.dateMinList[i].label=='15:00'){
        //   //      this.dateMinList[i].isYuYue=false;
        //   //   }
        //   // })
        // }
        console.log(this.dateMinList)

      })


    },
    changeHaomiaoDate(time){
      let date=new Date(time);
      let mouth=this.add0(date.getHours());
      let tDate = this.add0(date.getMinutes());
      console.log(mouth+':'+tDate)
      return mouth+':'+tDate;

    },
    isFloat(num){
      if(num==0){
        return '00'
      }else{
        return num
      }
    },
    getTodyTime(){
      var today = new Date();
      var tYear = today.getFullYear();
      var tMonth = today.getMonth();
      var tDate = today.getDate();
      tMonth = this.add0(tMonth + 1);

      tDate = this.add0(tDate);
      return {
        tYear,
        tMonth,
        tDate
      }
    },
    getDate(day){
      var today = new Date();

      var targetday_milliseconds=today.getTime() + 1000*60*60*24*day;
      today.setTime(targetday_milliseconds); //注意，这行是关键代码
      var tYear = today.getFullYear();
      var tMonth = today.getMonth();
      var tDate = today.getDate();
      tMonth = this.add0(tMonth + 1);
      tDate = this.add0(tDate);
      var dateWeek=today.getDay()
      var week=this.week[dateWeek];
      if(day==0){
        return {

          label:`今天(${week})`,
          value:tMonth+"-"+tDate

        }
      }else if(day==1){
        return {

          label:`明天(${week})`,
          value:tMonth+"-"+tDate

        }
      }else if(day==2){
        return{

          label:`后天(${week})`,
          value:tMonth+"-"+tDate

        }
      }else{
        return {
          label:tMonth+"-"+tDate,
          value:tMonth+"-"+tDate
        }
      }


    },

    getTime(){
      for(var i=0;i<6;i++){
        let obj={};
        // this.dateList[i]=this.getDate(i)
        obj.date=this.getDate(i).label
        obj.value=this.getDate(i).value
        if(i==0){
          this.date=obj.value;
          this.dateToday=obj.date;
          obj.isCurrent=true;
        }else{
          obj.isCurrent=false;
        }

        this.dateList.push(obj)
      }


    },
    add0(str){
      if(str<=9){
        return '0'+str;
      }  else{
        return str;
      }
    },
    showMulLinkageTwoPicker() {
      this.$refs.mpPicker.show();
    },
    onConfirm(e) {
      console.log(e);
    },
    // onChange(e) {
    //   console.log(e);
    // },
    onCancel(e) {
      console.log(e);
    },
    // 选择项目
    bzComPro(){
      if(JSON.stringify(this.resultListPro)!='{}'){
        this.showPro=false;
        this.projuctData=this.resultListPro;
       // this.$emit('getResult',this.resultList)
      }

    },
    initPro(data,userInfo){

      this.showPro=true;
      this.dataPro=data;
      this.userInfoPro=userInfo
      this.getDataPro();
    },
    chengItemIconPro(item,index){
      this.listPro.forEach((a,i)=>{
        a.isClick="circle"
        if(a.id==item.id){
          if(a.isClick=='circle'){
            a.isClick="checked"
            this.resultListPro=a;
          }
        }
        this.$set(this.listPro,i,a)

      })
      this.$forceUpdate();
    },
    getRasdio(val,item){
      console.log(val,item)
      this.resultListPro=val;
      this.listPro.forEach((a,i)=>{
        if(a.id==val.id){
          a.isClick=!val.isClick;
        }



      })
    },
    getDataPro(){
      let that=this;
      wx.request({
        url: 'https://xcx.saas.apis.huidianzhang.com:8080/hdz-apprest/v1.0/appletOperat/midForProduct', //仅为示例，并非真实的接口地址
        data: {
          "userId":this.userInfo.baseUserId,
          "phone":that.userInfo.phone,
          "productId":that.data.mid,
          "appid":appId.appId,
          "mid":that.data.mid
        },
        method:'post',
        header: {
          'content-type': 'application/json' // 默认值
        },
        success (data) {
          if(data.data.code==='0'){
            that.listPro=data.data.result;
            that.listPro.forEach((a,i)=>{
              a.isClick='circle';
            })
          }else{
            wx.showToast({
              title:`${data.data.message}`,
              icon: 'none',
              duration: 2000
            })
          }
        }
      })
      // this.$http.request({
      //   method:"post",
      //   url:"/v1.0/appletOperat/midForProduct",
      //   body:{
      //     "userId":this.userInfo.baseUserId,
      //     "phone":that.userInfo.phone,
      //     "productId":that.data.mid,
      //     "appid":appId.appId,
      //     "mid":that.data.mid
      //   }
      // }).then((data)=>{
      //   if(data.code==0){
      //     this.listPro=data.result;
      //     this.listPro.forEach((a,i)=>{
      //       a.isClick='circle';
      //     })
      //   }
      // })
    },
    // 选择技师
    bzComJs(){
      this.show.showJs=false;
      this.appionData=this.resultList;
     // this.$emit('getAppion',this.resultList)
    },
    init(data,usrInfo){
      this.dataJs=data;
      this.userInfoJs=usrInfo;
      this.getData();

    },
    chengItemIcon(item,index){
      this.listJs.forEach((a,i)=>{
        a.isClick="circle"
        if(a.id==item.id){
          if(a.isClick=='circle'){
            a.isClick="checked"
            this.resultList=a;
          }
        }
        this.$set(this.listJs,i,a)

      })
      this.$forceUpdate();
    },
//      getRasdio(val,item){
//        console.log(val,item)
//        this.resultList=val;
//        this.list.forEach((a,i)=>{
//             if(a.id==val.id){
//                a.isClick=!val.isClick;
//             }
//
//
//
//        })
//      },
    getData(){
      let that=this;
      this.$http.request({
        method:"post",
        url:"/v1.0/appletOperat/midForSuff",
        body:{
          "userId":this.userInfo.baseUserId,
          "phone":this.userInfo.mobileNo,
          "productId": that.data.mid,
          "appid":appId.appId,
          "mid":that.data.mid
        }
      }).then((data)=>{
        if(data.code==0){
          this.listJs=data.result;
          this.listJs.forEach((a,i)=>{
            a.ceremony_star=Math.round(a.ceremony_star*0.1)
            a.isClick='circle';
           a. skill_star=Math.round(a.skill_star*0.1)
          })
        }
      })
    },
    callPhone(){
      wx.makePhoneCall({
        phoneNumber: this.proDetail.merchantTel //仅为示例，并非真实的电话号码
      })
    },
    commitFun(){//立即预约
      if(JSON.stringify(this.projuctData)=='{}'){
        this.showPro=true;
        this.initPro(this.dataPro,this.userInfoPro)
       //  this.$refs.choseProjuct.init(this.data,this.userInfo);
      }else if(!this.time){
        this.timeShow=true;
        this.initTime(this.proDetail.businessHours,this.proDetail.endMinute,this.appionData.id)
        // this.$refs.getTIme.initTime()
      }else{
        this.bookingFun()
      }
    },
    bookingFun(){
       let that=this;
       let id="";
       if(this.data){
          id=that.projuctData.id
       }else{
         id=that.projuctData.id
       }
      wx.request({
        url: 'https://xcx.saas.apis.huidianzhang.com:8080/hdz-apprest/v1.0/appletOperat/appletAppointOperation', //仅为示例，并非真实的接口地址
        data: {
          "userId":that.userId,
          "phone":that.phone,
          "productId":id,
          "appid":appId.appId,
          "mid":that.data.mid,
          "scheduledTime":that.time,
          "suffid":that.appionData.id,
          "remark":that.textBz
        },
        method:'post',
        header: {
          'content-type': 'application/json' // 默认值
        },
        success (data) {
          if(data.data.code==0){
            wx.showToast({
              title: '预约成功',
              icon: 'success',
              duration: 2000
            })
            let url="/pages/myappointment/main";
            wx.navigateTo({url})
          }else{
            wx.showToast({
              title:`${data.message}`,
              icon: 'none',
              duration: 2000
            })
          }
        }
      })
      // this.$http.request({
      //   method:"post",
      //   url:"/v1.0/appletOperat/appletAppointOperation",
      //   body:{
      //    	"userId":that.userId,
      //     "phone":that.phone,
      //     "productId":id,
      //     "appid":appId.appId,
      //     "mid":that.data.mid,
      //     "scheduledTime":that.time,
      //     "suffid":that.appionData.id,
      //     "remark":that.textBz
      //   }
      // }).then((data)=>{
      //   if(data.code==0){
      //      wx.showToast({
      //         title: '预约成功',
      //         icon: 'success',
      //         duration: 2000
      //       })
      //       let url="/pages/myappointment/main";
      //       wx.navigateTo({url})
      //   }else{
      //      wx.showToast({
      //         title:`${data.message}`,
      //         icon: 'none',
      //         duration: 2000
      //       })
      //   }
      // })
    },
    // getResultFun(val){//选择项目
    //   this.projuctData=val;
    //
    // },
    // getDateFun(date){//选择时间回调
    // this.time=date+':00';
    // },
    bzCom(){
     this.showBz=false;

    },
    // getAppionFun(val){
    //   console.log(val)
    //
    // },
    getAppointment(){//选择技师
      // console.log(this.$refs.appointmentArtificer)
      this.show.showJs=true;
      this.init()
     // this.$refs.appointmentArtificer.init(this.data,this.userInfo)
    },
    ...mapGetters(['user','AppletCode']),
    getDateBox(){

		if(this.appionData.name){
		  this.timeShow=true;
		  this.initTime(this.proDetail.businessHours,this.proDetail.endMinute,this.appionData.id)
		//	this.$refs.getTIme.init(this.proDetail.businessHours,this.proDetail.endMinute,this.appionData.id)
		}else{
			wx.showToast({
			  title:'请选择技师',
			  icon: 'none',
			  duration: 2000
			})
		}

      console.log(this.$refs.getTIme)
    },
    choseProject(){//选择项目
      this.showPro=true;
      this.initPro(this.dataPro,this.userInfoPro)
    //  this.$refs.choseProjuct.init(this.data,this.userInfo);
    },
    getDetail(){
      let that=this;
      this.$http.request({
        method:"post",
        url:"/v1.0/appletAppoint/appletAppointDetail",
        body:{
          "userId":that.userId,
          "phone":that.phone,
          "productId":that.data.mid,
          "appid":appId.appId,
          status:'0',
          "mid":that.data.mid
        }
      }).then((data)=>{
        if(data.code==0){
          this.proDetail=data.result;
        }
      })
    },
    projectList(status){//项目列表
      let that=this;
      let {mobileNo}=that.user();
      status=status==0?'':status
      this.$http.request({
        method:"post",
        url:"/v1.0/appletOperat/midForProduct",
        body:{
          "userId":that.userId,
          "phone":that.phone,
          "productId":that.data.mid,
          "appid":appId.appId,
          "mid":that.data.mid
        }
      }).then((data)=>{
        if(data.code==0){

        }
      })
    },
    dateCom(val){
      console.log(val)
      this.time=val.label;
    },
    // showMulLinkageTwoPicker() {
    //   this.$refs.mpPicker.show();
    // },
    // onConfirm(e) {
    //   console.log(e);
    // },
    // onChange(e) {
    //   console.log(e);
    // },
    // onCancel(e) {
    //   console.log(e);
    // },
    bindViewTap () {
      const url = '../logs/main'
      if (mpvuePlatform === 'wx') {
        mpvue.switchTab({ url })
      } else {
        mpvue.navigateTo({ url })
      }
    }
  },

  created () {
    // let app = getApp()
  }
}
</script>

<style scoped>
  .getTIme .radio-group{
    width: 100%;
  }
  .dialog_bot_con{
    text-align: left;
    /*padding: 0px;*/
  }
  .dialog_bot_btn .weui-dialog__btn_primary{
    margin: 0.6em 2em;
    background: #FF787E;
    border-radius: 1.2em;
    color: #fff;
    height: 2.4em;
  }
  .date{
    background: #f8f8f8;
    width: 8em;
    color: #333;
    font-size: 1em;
  }
  .dialog_bot_title{
    height: 2.6em;
    line-height: 2.6em;
    border-bottom: 1px #eee solid;
    padding: 0px;
    text-align: left;
  }
  .dialog_bot{
    min-width: 100%;
    bottom: 0px;
    left: 0px;
    right: 0px;
    top: auto;
    z-index: 999999;
    -webkit-transform:translate(0%,0%);
    transform:translate(0%,0%);
  }
  .time{
    padding: 0.6em;
  }
  .time .current{
    color: #FF787E;
  }
  .date ul li.current{
    background: #fff;
  }
  .date ul li{
    height: 2.4em;
    line-height: 2.4em;
    text-align: center;
  }
  .date ul li.current{
    background: #fff;
  }

  .s_name{
    color: #000;
    margin-bottom: 0.4em;
  }
  .s_pic{
    width: 5.6em;
    height: 5.6em;
    border-radius: 0.3em;
    margin-right: 0.6em;
  }
.page{
  padding-bottom: 3.6em;
}
.c_info{
  background: #fff;
  padding: 0.8em 0;
  text-align: center;
  font-size: 0.8em;
}
.weui-textarea{
  box-sizing: border-box;
  padding:0.8em;
}
.c_pic{
  width: 5em;
  height: 5em;
  border-radius: 0.3em;
  margin: 0 auto;
}
.dialog_bot{
  min-width: 100%;
  bottom: 0px;
  left: 0px;
  right: 0px;
  top: auto;
  z-index: 999999;
  -webkit-transform:translate(0%,0%);
  transform:translate(0%,0%);
}
.dialog_bot_title{
  height: 2.6em;
  line-height: 2.6em;
  border-bottom: 1px #eee solid;
  padding: 0px;
  text-align: left;
}
.dialog_bot_btn .weui-dialog__btn_primary{
  margin: 0.6em 2em;
  background: #FF787E;
  border-radius: 1.2em;
  color: #fff;
  height: 2.4em;
}
.dialog_bot_title span{
  padding-left: 0.6em;
}
.dialog_bot_title .close{
  float: right;
  width: 2.6em;
  height: 2.6em;
  text-align: center;
}
.weui-dialog__bd{
  box-sizing: border-box;
  padding-top:0.8em;
}
.store_address{
  font-size: 0.9em;
  color: #666;
  text-align: left;
}
.store_address:before{
  display: none;
}
.store_address img{
  width: 0.8em;
  margin-right: 0.4em;
}
.phonelink{
  border-left: 1px #eee solid;
  padding-left: 0.8em;
  padding-right: 0.4em;
}
.phonelink img{
  width: 1.4em;
}
.footbtn{
  position: fixed;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background: #fff;
  border-top: 1px #eee solid;
  padding: 0.6em 2em;
  z-index: 9999;
}
.footbtn a{
  display: block;
  height: 2.4em;
  border-radius: 1.2em;
  background: #FF787E;
  color: #fff;
  line-height: 2.4em;
  text-align: center;
  color: #fff;
  font-size: 1em;
}
</style>
